@import '../../app';


.share-wrap{
  .page-bg;
  height: 100%;
  overflow: hidden;
  min-height: unset;
  .share-canvas{
    width: 100%;
    height: 100%;
    position: relative;
  }
  .share-bg{
    width: 100%;
    height: 100%;
  }
  .share-con{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    padding: 60px 0 170px 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
  }
  .share-ad{
    width: auto;
    max-width: 80%;
    height: auto;
  }
  .share-info{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    .share-header{
      width: 80px;
      height: 80px;
      border: 2PX solid #fff;
      border-radius: 100%;
    }
    .share-username{
      font-size: 30px;
      color: #fff;
      margin: 10px 0 30px 0;
    }
    .viple{
      background: #fff;
      color: @theme-color;
      font-size: 24px;
      text-align: center;
      padding: 0 15px;
      border-radius: 100px;

    }
    .share-code{
      padding: 10px;
      box-sizing: border-box;
      background: #fff;
    }
    .share-tip{
      color: #fff;
      font-size: 24px;
      margin-top: 20px;
    }
  }

}

.share-img{
  position: fixed;
  z-index: 9999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  .img{
    width: 90%;
    height: 90%;
    /*transform: scale3d(1,1,1);
    transition: all 0.3s ease-in-out;*/
  }
  /*.img-active{
    transform: scale3d(0.9,0.9,0.9);
  }*/
  .tipsText{
    background: #fff;
    width: 90%;
    text-align: center;
    padding: 15px 0;
    border-top: 1px solid #ddd;
  }
}
